
<!DOCTYPE html>
<html lang="en">

    <head>
        <meta charset="UTF-8">
        <style>
            .box {
                width: 300px;
                height: 300px;
                background-color: red;
            }
        </style>
    </head>

    <body>
    <div class="box"></div>
    <script>
        // 函数节流高频事件在单位时间内触发
        function thottle(callback, wait) {
            let previous = 0; //上次的执行时间
            return function() {
                let now = Date.now(); //获得当前时间戳
                let args = arguments; //获得参数
                if (now - previous > wait) {
                    callback.apply(this, args); //调用回调函数
                    previous = now; //更新每一次的执行时间
                }
            }
        }

        let box = document.querySelector('.box');
        box.onmousemove = thottle(function() {
            console.log('mousemove执行了' + Date.now());
        }, 1000);
    </script>
    </body>

</html>
